<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>京东商城-购物车</title>
    <link rel="icon" href="./images/picture.ico" type="image/x-icon" />
    <link rel="stylesheet" href="./css/public.css">
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/cart.css">
    <link rel="stylesheet" href="./font/iconfont.css">
    <script src="./js/jquery.js"></script>
    <script src="./js/layer/layer.js"></script>
</head>

<body>
    <!-- header 头部 开始 -->
    <header>
        <div class="head1">
            <div class="main h">
                <!-- 左边部分头部导航 -->
                <ul class="fl hlist1 pos-r">
                    <li class="index">
                        <i class="iconfont icon-shouye_5 fs18"></i>
                        <a href="./index.html" style="color: #666;">京东首页</a>
                    </li>
                    <li class="dropdown adr">
                        <!-- 位置内容 -->
                        <a href="JavaScript:void(0);" class="txt1 hov">
                            <i class="iconfont icon-ziyuan" id="i1"></i>
                            <span class="adrtxt">湖南</span>
                        </a>
                        <!-- 地址下拉框 -->
                        <div class="drop">
                            <!-- 下拉框的 地址信息 -->
                            <div class="adrbox">
                                <div class="adressbox">
                                    <div class="adress">
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="1">北京</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="2">上海</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="3">天津</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="4">重庆</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="5">河北</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="6">山西</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="7">河南</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="8">辽宁</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="9">吉林</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="10">黑龙江</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="11">内蒙古</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="12">江苏</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="13">山东</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="14">安徽</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="15">浙江</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="16">福建</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="17">湖北</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="18" class="selected">湖南</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="19">广东</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="20">广西</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="21">四川</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="22">海南</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="23">贵州</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="24">云南</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="25">西藏</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="26">陕西</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="27">甘肃</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="28">青海</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="29">宁夏</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="30">西藏</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="1">港澳</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="1">台湾</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="1">钓鱼岛</a>
                                        </div>
                                        <div class="item">
                                            <a href="JavaScript:void(0);" data-num="1">海外</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- 下拉框的 其他信息 -->
                            <div class="edition">
                                <div class="crossing"></div>
                                <p>地区专享版本</p>
                                <ul class="arealist">
                                    <li>
                                        <a href="JavaScript:void(0);">
                                            <div>中國港澳</div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="JavaScript:void(0);">
                                            <div>中國台灣</div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="JavaScript:void(0);">
                                            <div>京东全球</div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <div class="edition">
                                <div class="crossing"></div>
                                <p>Available Sites</p>
                                <ul class="arealist">
                                    <li>
                                        <a href="JavaScript:void(0);">
                                            <div class="site1 tubiao"></div>
                                            <div>Global Site</div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="JavaScript:void(0);">
                                            <div class="site2 tubiao"></div>
                                            <div>Сайт России</div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="JavaScript:void(0);">
                                            <div class="site3 tubiao"></div>
                                            <div>Situs Indonesia</div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="JavaScript:void(0);">
                                            <div class="site4 tubiao"></div>
                                            <div>Sitio de España</div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="JavaScript:void(0);">
                                            <div class="site5 tubiao"></div>
                                            <div>เว็บไซต์ประเทศไทย</div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </li>
                </ul>
                <ul class="fl"></ul>
                <!-- 右边部分头部导航 -->
                <ul class="fr hlist2">
                    <li class="">
                        <a href="JavaScript:void(0);" class="hov de1">你好,请登录</a>
                        &nbsp;&nbsp;
                        <a href="JavaScript:void(0);" class="hov de2">免费注册</a>
                    </li>
                    <li class="shu"></li>
                    <li class="">
                        <div class="dt">
                            <a href="JavaScript:void(0);" class="hov">我的订单</a>
                        </div>
                    </li>
                    <li class="shu"></li>
                    <!-- 我的京东 有下拉 -->
                    <li class="dropdown myjd">
                        <div class="dt ddt chan">
                            <a href="JavaScript:void(0);" class="hov">我的京东</a>
                            <i class="iconfont icon-xia i2"></i>
                        </div>
                        <!-- 下拉内容 -->
                        <div class="drop">
                            <div class="top">
                                <div class="left">
                                    <div class="item">
                                        <a href="JavaScript:void(0);">
                                            待处理订单
                                            <span></span>
                                        </a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">
                                            返修退换货
                                        </a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">
                                            降价商品
                                            <span></span>
                                        </a>
                                    </div>
                                </div>
                                <div class="right">
                                    <div class="item">
                                        <a href="JavaScript:void(0);">
                                            我的问答
                                            <span></span>
                                        </a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">
                                            我的关注
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="top bottom">
                                <div class="left">
                                    <div class="item">
                                        <a href="JavaScript:void(0);">我的京豆</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">我的白条</a>
                                    </div>
                                </div>
                                <div class="right">
                                    <div class="item">
                                        <a href="JavaScript:void(0);">
                                            我的优惠券
                                            <span></span>
                                        </a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">我的理财</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="shu"></li>
                    <li class="">
                        <div class="dt">
                            <a href="JavaScript:void(0);" class="hov">京东会员</a>
                        </div>
                    </li>
                    <li class="shu"></li>
                    <!-- 企业采购 有下拉 -->
                    <li class="dropdown business">
                        <div class="dt ddt chan">
                            <a href="JavaScript:void(0);" class="hov">企业采购</a>
                            <i class="iconfont icon-xia i2"></i>
                        </div>
                        <!-- 下拉内容 -->
                        <div class="drop">
                            <div class="businessinner">
                                <div class="item">
                                    <a href="JavaScript:void(0);">企业购</a>
                                </div>
                                <div class="item">
                                    <a href="JavaScript:void(0);">商用场景馆</a>
                                </div>
                                <div class="item">
                                    <a href="JavaScript:void(0);">工业品</a>
                                </div>
                                <div class="item">
                                    <a href="JavaScript:void(0);">丰客多商城</a>
                                </div>
                                <div class="item">
                                    <a href="JavaScript:void(0);">礼品卡</a>
                                </div>
                                <div class="item">
                                    <a href="JavaScript:void(0);">微信企业购</a>
                                </div>
                                <div class="item">
                                    <a href="JavaScript:void(0);">工品优选</a>
                                </div>
                                <div class="item">
                                    <a href="JavaScript:void(0);">京东锦礼</a>
                                </div>
                                <div class="item itemlast">
                                    <a href="JavaScript:void(0);">大中型企业采购</a>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="shu"></li>
                    <!-- 客户服务 有下拉 -->
                    <li class="dropdown customer">
                        <div class="dt ddt chan">
                            <a href="JavaScript:void(0);">客户服务</a>
                            <i class="iconfont icon-xia i2"></i>
                        </div>
                        <!-- 下拉内容 -->
                        <div class="drop">
                            <div class="client">客户</div>
                            <div class="item">
                                <a href="JavaScript:void(0);">帮助中心</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">售后服务</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">在线客服</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">意见建议</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">电话客服</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">客服邮箱</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">金融咨询</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">全球售客服</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">企业客服</a>
                            </div>
                            <div class="item-business">商户</div>
                            <div class="item">
                                <a href="JavaScript:void(0);">合作招商</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">成长中心</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">商家后台</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">京麦工作台</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">商家帮助</a>
                            </div>
                            <div class="item">
                                <a href="JavaScript:void(0);">规则平台</a>
                            </div>
                        </div>
                    </li>
                    <li class="shu"></li>
                    <!-- 网站导航 有下拉 -->
                    <li class="dropdown sitenav">
                        <div class="dt ddt chan">
                            <a href="JavaScript:void(0);">网站导航</a>
                            <i class="iconfont icon-xia i2"></i>
                        </div>
                        <!-- 下拉内容 -->
                        <div class="drop">
                            <!-- 特色主题 -->
                            <dl class="dl1">
                                <dt>特色主题</dt>
                                <dd>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">新品首发</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京东金融</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">全球售</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">国际站</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京东会员</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">台湾售</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">俄语站</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">装机大师</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">港澳售</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">优惠券</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">秒杀</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">闪购</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">印尼站</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">陪伴计划</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">出海招商</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">拍拍二手</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">买什么</a>
                                    </div>
                                </dd>
                            </dl>
                            <!-- 行业频道 -->
                            <dl class="dl2">
                                <dt>行业频道</dt>
                                <dd>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">手机</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">智能数码</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">电脑办公</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">家用电器</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京鱼座智能</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京东服饰</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京东生鲜</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">家装城</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">母婴</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">食品</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">农资频道</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">整车</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">图书</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">劳动防护</a>
                                    </div>
                                </dd>
                            </dl>
                            <!-- 生活服务 -->
                            <dl class="dl3">
                                <dt>生活服务</dt>
                                <dd>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京东众筹</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">白条</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京东金融App</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京东小金库</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">理财</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">话费</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">水电煤</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">彩票</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">旅行</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">机票酒店</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">电影票</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京东到家</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">游戏</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">拍拍回收</a>
                                    </div>
                                </dd>
                            </dl>
                            <!-- 更多精选 -->
                            <dl class="dl4">
                                <dt>更多精选</dt>
                                <dd>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">合作招商</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京东通信</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京东E卡</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">企业采购</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">服务市场</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">办公生活馆</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">校园加盟</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">京东社区</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">游戏社区</a>
                                    </div>
                                    <div class="item">
                                        <a href="JavaScript:void(0);">知识产权维权</a>
                                    </div>
                                </dd>
                            </dl>
                        </div>
                    </li>
                    <li class="shu"></li>
                    <!-- 京东手机 -->
                    <li class="pos-r mobile">
                        <div class="dt mobiletxt">京东手机</div>
                        <!-- 二维码 -->
                        <!-- <div class="erweiimg">
                            <div></div>
                        </div> -->
                        <!-- 下拉内容 -->
                        <div class="drop">
                            <div class="droperweima">
                                <div class="erweiitem">
                                    <div class="imgbox">
                                        <img src="./images/2code1.jpg" class="">
                                    </div>
                                    <div class="infobox">
                                        <h5 class="hh">手机京东</h5>
                                        <p class="p1">新人专享大礼包</p>
                                        <p class="p2">
                                            <a href="JavaScript:void(0);" class="app1">APP Store</a>
                                            <a href="JavaScript:void(0);" class="app2">安卓市场</a>
                                            <a href="JavaScript:void(0);" class="app3">APP Store</a>
                                        </p>
                                    </div>
                                </div>
                                <div class="erweiitem">
                                    <div class="imgbox">
                                        <img src="./images/2code2.jpg" class="">
                                    </div>
                                    <div class="infobox">
                                        <h5 class="hh">关注京东JD.COM</h5>
                                        <p class="p1">抢5元红包</p>
                                        <p class="p2"></p>
                                    </div>
                                </div>
                                <div class="erweiitem">
                                    <div class="imgbox">
                                        <img src="./images/2code3.jpg" class="">
                                    </div>
                                    <div class="infobox">
                                        <h5 class="hh">京东金融客户端</h5>
                                        <p class="p1">新人专享大礼包</p>
                                        <p class="p2">
                                            <a href="JavaScript:void(0);" class="app1">APP Store</a>
                                            <a href="JavaScript:void(0);" class="app2">安卓市场</a>
                                        </p>
                                    </div>
                                </div>
                                <div class="erweiitem">
                                    <div class="imgbox">
                                        <img src="./images/2code4.jpg" class="">
                                    </div>
                                    <div class="infobox">
                                        <h5 class="hh">
                                            京东健康客户端
                                        </h5>
                                        <p class="p1"></p>
                                        <p class="p2">
                                            <a href="JavaScript:void(0);" class="app1">APP Store</a>
                                            <a href="JavaScript:void(0);" class="app2">安卓市场</a>
                                        </p>
                                    </div>
                                </div>
                                <div class="erweiitem">
                                    <div class="imgbox">
                                        <img src="./images/2code5.jpg" class="">
                                    </div>
                                    <div class="infobox">
                                        <h5 class="hh">关注京东小程序</h5>
                                        <p class="p1">新人0.1元购</p>
                                        <p class="p2"></p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </header>
    <!-- header 头部 结束 -->

    <!-- banner 开始 -->
    <section>
        <div class="banner">
            <div class="main con clearFix">
                <div class="cartlogo">
                    <a href="JavaScript:void(0);" class="logo"></a>
                    <a href="JavaScript:void(0);" class="null"></a>
                </div>
                <div class="cartsearch">
                    <div class="formbox">
                        <input type="text" class="in1">
                        <input type="button" class="in2" value="搜索">
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- banner 结束 -->

    <!-- 内容 开始 -->
    <section>
        <div class="cartbody">
            <div class="container cart">
                <div class="title">
                    <ul>
                        <li>
                            <a href="JavaScript:void(0);">
                                <em>全部商品</em>
                                <span></span>
                            </a>
                        </li>
                    </ul>
                </div>
                <div class="carthead">
                    <div class="column thcheck"></div>
                    <div class="column thgoods">商品</div>
                    <div class="column th">&nbsp;</div>
                    <div class="column thprice">单价</div>
                    <div class="column thnum">数量</div>
                    <div class="column thsum">总计</div>
                    <div class="column thact">操作</div>
                </div>
                <div class="" id="cart">
                    <div class="cartbody">
                        <div class="itemlist">
                            <div class="item-item">
                                <div class="item clearFix">
                                    <div class="cell pcheck"></div>
                                    <div class="cell pname">
                                        <div class="goods">
                                            <div class="pimg">
                                                <img src="./images/cartitem.jpg" alt="">
                                            </div>
                                            <div class="pinfo">
                                                <div class="p-name">
                                                    惠寻自动开收雨伞
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="cell pnull"></div>
                                    <div class="cell pprice">
                                        <span class="price">￥35.90</span>
                                        <p class="pp"></p>
                                    </div>
                                    <div class="cell pnum">
                                        <div class="cartnum">
                                            <button class="sub disable">
                                                <i></i>
                                            </button>
                                            <div class="number">
                                                <input type="text" value="1">
                                            </div>
                                            <button class="add">
                                                <i></i>
                                            </button>
                                            <p class="pp">有货</p>
                                        </div>
                                    </div>
                                    <div class="cell psum">
                                        <strong>￥35.90</strong>
                                    </div>
                                    <div class="cell pops">
                                        <a href="JavaScript:void(0);">删除</a>
                                        <a href="JavaScript:void(0);">移入关注</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- 内容 结束 -->

    <!-- footer 底部 开始 -->
    <footer>
        <section class="fcolor1">
            <article class="fline1">
                <div class="fconbox1 main">
                    <div class="fimgtxt">
                        <div class="fimg f-fimg1"></div>
                        <div class="ftxt">品类齐全，轻松购物</div>
                    </div>
                    <div class="fimgtxt">
                        <div class="fimg f-fimg2"></div>
                        <div class="ftxt">多仓直发，极速配送</div>
                    </div>
                    <div class="fimgtxt">
                        <div class="fimg f-fimg3"></div>
                        <div class="ftxt">正品行货，精致服务</div>
                    </div>
                    <div class="fimgtxt">
                        <div class="fimg f-fimg4"></div>
                        <div class="ftxt">天天低价，畅选无忧</div>
                    </div>
                </div>
            </article>
            <article class="fline2">
                <div class="fconbox2 main">
                    <dl>
                        <dt>购物指南</dt>
                        <dd><a href="">购物流程</a></dd>
                        <dd><a href="">会员介绍</a></dd>
                        <dd><a href="">生活旅行/团购</a></dd>
                        <dd><a href="">常见问题</a></dd>
                        <dd><a href="">大家电</a></dd>
                        <dd><a href="">联系客服</a></dd>
                    </dl>
                    <dl>
                        <dt>配送方式</dt>
                        <dd><a href="">上门自提</a></dd>
                        <dd><a href="">211限时达</a></dd>
                        <dd><a href="">配送服务查询</a></dd>
                        <dd><a href="">配送费收取标准</a></dd>
                        <dd><a href="">海外配送</a></dd>
                    </dl>
                    <dl>
                        <dt>支付方式</dt>
                        <dd><a href="">货到付款</a></dd>
                        <dd><a href="">在线支付</a></dd>
                        <dd><a href="">分期付款</a></dd>
                        <dd><a href="">公司转账</a></dd>
                    </dl>
                    <dl>
                        <dt>售后服务</dt>
                        <dd><a href="">售后政策</a></dd>
                        <dd><a href="">价格保护</a></dd>
                        <dd><a href="">退款说明</a></dd>
                        <dd><a href="">返修/退换货</a></dd>
                        <dd><a href="">取消订单</a></dd>
                    </dl>
                    <dl>
                        <dt>特色服务</dt>
                        <dd><a href="">夺宝岛</a></dd>
                        <dd><a href="">DIY装机</a></dd>
                        <dd><a href="">延保服务</a></dd>
                        <dd><a href="">京东E卡</a></dd>
                        <dd><a href="">京东通信</a></dd>
                        <dd><a href="">京鱼座智能</a></dd>
                    </dl>
                </div>
            </article>
            <article class="fline3">
                <div class="fconbox3 main fs12">
                    <ul class="flist1 ">
                        <li><a href="">关于我们</a><span>│</span></li>
                        <li><a href="">联系我们</a><span>│</span></li>
                        <li><a href="">联系客报</a><span>│</span></li>
                        <li><a href="">台作招商</a><span>│</span></li>
                        <li><a href="">商家帮助</a><span>│</span></li>
                        <li><a href="">营销中心</a><span>│</span></li>
                        <li><a href="">手机京东</a><span>│</span></li>
                        <li><a href="">友情诺接</a><span>│</span></li>
                        <li><a href="">销售联盟</a><span>│</span></li>
                        <li><a href="">京东社区</a><span>│</span></li>
                        <li><a href="">风险监测</a><span>│</span></li>
                        <li><a href="">隐私政策</a><span>│</span></li>
                        <li><a href="">京东公益</a><span>│</span></li>
                        <li><a href="">Engish Site</a><span>│</span></li>
                        <li><a href="">Media &#38; IR</a></li>
                    </ul>
                    <ul class="flist2">
                        <li><a href="">京公网安备 11000002000088号</a><span>│</span></li>
                        <li>京ICP证070359号<span>│</span></li>
                        <li><a href="">互联网药品信息服务资格证编号(京)-经营性-2014-0008</a><span>│</span></li>
                        <li>新出发京零 字第大120007号</li>
                    </ul>
                    <ul class="flist2">
                        <li>互联网出版许可证编号新出网证(京)字150号<span>│</span></li>
                        <li><a href="">出版物经营许可证</a><span>│</span></li>
                        <li><a href="">网络文化经营许可证京网文[2014]2148-348号</a><span>│</span></li>
                        <li>违法和不良信息举报电话: &nbsp;40065155</li>
                    </ul>
                    <ul class="flist2">
                        <li>Copyright &copy; 2004-2021京东JD.com版权所有<span>│</span></li>
                        <li>消费者维权热线: &nbsp;4006067733&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="">经营证照</a><span>│</span>
                        </li>
                        <li>(京)网械平台备字(2018)第00003号<span>│</span></li>
                        <li><a href="">营业执照</a></li>
                    </ul>
                    <ul class="flist2">
                        <li>
                            <a href="">
                                <img data-original="./images/country01.jpg" class="lazy" />
                            </a>
                            <a href="">
                                Global Site
                            </a>
                            <span>│</span>
                        </li>
                        <li>
                            <a href="">
                                <img data-original="./images/country02.jpg" class="lazy" />
                            </a>
                            <a href="">
                                Cair PoccwM
                            </a>
                            <span>│</span>
                        </li>
                        <li>
                            <a href="">
                                <img data-original="./images/country03.jpg" class="lazy" />
                            </a>
                            <a href="">
                                Situs Indonesia
                            </a>
                            <span>│</span>
                        </li>
                        <li>
                            <a href="">
                                <img data-original="./images/country04.jpg" class="lazy" />
                            </a>
                            <a href="">
                                Sitio de Espania
                            </a>
                            <span>│</span>
                        </li>
                        <li>
                            <a href="">
                                <img data-original="./images/country05.jpg" class="lazy" />
                            </a>
                            <a href="">
                                thuilwlsanrlna
                            </a>
                        </li>
                    </ul>
                    <ul class="flist2">
                        <li>京东旗下网站: &nbsp;&nbsp;<a href="">京东钱包</a><span>│</span></li>
                        <li><a href="">京东智联云</a></li>
                    </ul>
                    <div class="flist3">
                        <div class="fbtn imgbtn1"><a href=""></a></div>
                        <div class="fbtn imgbtn2"><a href=""></a></div>
                        <div class="fbtn imgbtn3"><a href=""></a></div>
                        <div class="fbtn imgbtn4"><a href=""></a></div>
                        <div class="fbtn imgbtn5"><a href=""></a></div>
                    </div>
                </div>
            </article>
        </section>
        <section class="fcolor2"></section>
    </footer>
    <!-- footer 底部 结束 -->
</body>
<script>
    $(function () {
        $(window).on("load", function () {
            let data = JSON.parse(localStorage.getItem("userInfo") || '{}');
            if (data.uName) {
                $(".de1").text("欢迎回来");
            }
            $(".de2").text(data.uName);
        })
    })
    // 渲染购物车
    $(function () {
        $.ajax({
            url: "/api/cartList",
            data: { uId: JSON.parse(localStorage.getItem("userInfo")).uId }
        }).done(function (res) {
            let { data } = res;
            console.log(data);
            // cId: 2
            // cImg: "./images/2.jpg"
            // cStatus: "1"
            // cTime: "2021-07-07T12:37:55.000Z"
            // pName: "脑白金600ML"
            // pNumber: "1"
            // pPrice: "168"
            // pTotal: "168"
            // uId: 5
            let strHtml = "";
            data.forEach(el => {
                strHtml += `
                <div class="cartbody">
                        <div class="itemlist">
                            <div class="item-item">
                                <div class="item clearFix">
                                    <div class="cell pcheck"></div>
                                    <div class="cell pname">
                                        <div class="goods">
                                            <div class="pimg">
                                                <img src=${el.cImg} alt="">
                                            </div>
                                            <div class="pinfo">
                                                <div class="p-name">
                                                    ${el.pName}
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="cell pnull"></div>
                                    <div class="cell pprice">
                                        <span class="price">${el.pPrice}</span>
                                        <p class="pp"></p>
                                    </div>
                                    <div class="cell pnum">
                                        <div class="cartnum">
                                            <button class="sub">
                                                <i></i>
                                            </button>
                                            <div class="number">
                                                <input type="text" value=${el.pNumber}>
                                            </div>
                                            <button class="add">
                                                <i></i>
                                            </button>
                                            <p class="pp">有货</p>
                                        </div>
                                    </div>
                                    <div class="cell psum">
                                        <strong>${el.pTotal}</strong>
                                    </div>
                                    <div class="cell pops">
                                        <a href="JavaScript:void(0);" cid=${el.cId} class="del">删除</a>
                                        <a href="JavaScript:void(0);">移入关注</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                `
            });
            $("#cart").html(strHtml);
        })
    })
    // 从购物车中删除  数量的加加减减
    $(function () {
        $("#cart").on("click", ".del", function () {
            let ele_A = this;
            layer.confirm("删除商品,也可以选择移入关注",
                ["移入关注", "删除商品"],
                function () {
                    let cid = $(ele_A).attr("cid");
                    console.log(cid);
                    $.ajax({
                        url: "/api/delete",
                        type: "post",
                        data: { cid }
                    }).then((res) => {
                        layer.msg(res.message)
                        $("#cart").find(".cartbody").remove();
                    })
                },
                function () {
                }
            )
        })
        $("#cart").on("click", ".add", function () {
            let num = $(this).prev().children().val();
            $(this).prev().prev().removeClass("disable");
            $(this).prev().children().val(++num);
            //修改总金额
            let price = $("#cart").find(".pprice").children().eq(0).text();
            $("#cart").find(".psum").children().text(num * price);

            let cid = $("#cart").find(".pops").children().eq(0).attr("cid");
            $.ajax({
                url: "/api/modify",
                type: "post",
                data: {
                    pnum: num,
                    cid
                }
            }).then(function (res) {
                layer.msg(res.message);
            })
        })
        $("#cart").on("click", ".sub", function () {
            let num = $(this).next().children().val();
            if (num <= 1) {
                return;
            } else {
                $(this).removeClass("disable");
            }
            $(this).next().children().val(--num);
            if (num <= 1) {
                $(this).addClass("disable");
            }
            //修改总金额
            let price = $("#cart").find(".pprice").children().eq(0).text();
            $("#cart").find(".psum").children().text(num * price);

            let cid = $("#cart").find(".pops").children().eq(0).attr("cid");
            $.ajax({
                url: "/api/modify",
                type: "post",
                data: {
                    pnum: num,
                    cid
                }
            }).then(function (res) {
                layer.msg(res.message);
            })
        })
    })
</script>

</html>